<#include "/public/macro.html">
<style type="text/css">
.layui-container {
    width: 950px;
    margin: 0;
}
.layui-laypage-limits{
	display:none !important;
}
</style>
<div class="uk-layui-form">
	<form id="disform" class="layui-form" action="/apps/contacts/dis/save.html" method="post">
		<input type="hidden" name="itemid" value="<#if itemid??>${itemid!''}</#if>">
		<input type="hidden" name="ckind" value="<#if ckind??>${ckind!''}</#if>">
		<input type="hidden" name="filter" value="<#if filter??>${filter!''}</#if>">
		<div class="layui-tab">
		  <ul class="layui-tab-title">
		    <li class="layui-this">选择坐席</li>
		    <#if !organ??><li>选择部门</li></#if>
		    <li>分配设置</li>
		  </ul>
		  <div class="layui-tab-content" style="margin: 0;padding: 0;">
		    <div class="layui-tab-item layui-show">
		 		<div id="root"></div>
		        <div id="root1"></div>
		    </div>
		    <#if !organ??>
		    <div class="layui-tab-item">
		    	<div class="row" style="height:500px;">
					<div class="col-lg-3" style="overflow-y:auto;">
						<div class="row" style="padding:5px;">
						<div class="col-lg-12">
							<ul id="organTree" class="ztree"></ul>
						</div>
					</div>
					</div>
					<div class="col-lg-9" style="border-left:1px solid #dedede;">
						<div class="box">
							<div class="box-body" style="padding:0px 2px;position: relative;height:299px;overflow-y:auto;" id="skillAgentList">
								<#include "/apps/business/contacts/callagentorgan.html">
							</div>
						</div>
					</div>
				</div>
		    </div>
		    </#if>
		    <div class="layui-tab-item" style="margin-top: 6px;">
		    	<div class="layui-collapse">
					<div class="layui-colla-item">
						<h2 class="layui-colla-title">分配配置</h2>
						<div class="layui-colla-content layui-show">
							<div class="layui-form-item">
								<div class="layui-inline">
									<label class="layui-form-label">分配数量：</label>
									<div class="layui-input-inline" style="width:200px;padding-top:2px;">
										<input type="number" name="disnum" min="1" max="${size!'0'}" value="${size!'0'}" class="layui-input" required lay-verify="required">
									</div>
								</div>
								<div class="layui-inline uckefu-inline">
									<label class="layui-form-label">执行方式：</label>
									<div class="layui-input-inline" style="width:200px;padding-top:2px;">
										<input name="plantask"  value="1" type="radio" title="自动" lay-filter="plantask"/>
										<input name="plantask" checked="checked" value="0" type="radio" title="手动" lay-filter="plantask"/>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="layui-colla-item" id="autoplan" style="display: none;">
						<h2 class="layui-colla-title">活动任务</h2>
						<div class="layui-colla-content layui-show">
							<div class="layui-form-item">
								<div class="layui-inline">
									<label class="layui-form-label">类型：</label>
									<div class="layui-input-inline" style="width:280px;padding-top:2px;">
										<input name="runCycle" value="day" lay-filter="exchange" checked="checked" type="radio" title="每天"/>
										<input name="runCycle" value="week" lay-filter="exchange"  type="radio" title="每周"/>
										<input name="runCycle" value="month" lay-filter="exchange"  type="radio" title="每月"/>
									</div>
								</div>
							</div>
							<div id="run_space_tr">
								<div class="layui-form-item">
									<div class="layui-inline">
										<label class="layui-form-label">日期类型：</label>
										<div class="layui-input-inline" style="width:360px;padding-top:2px;">
											<input lay-skin="primary"  value="0" name="datetypes" type="checkbox" title="工作日" >
											<input lay-skin="primary"  value="1" name="datetypes" type="checkbox" title="节日">
											<input lay-skin="primary"  value="2" name="datetypes" type="checkbox" title="假日">
										</div>
									</div>
								</div>
								<div class="layui-form-item">
									<div class="layui-inline">
										<label class="layui-form-label">运行间隔：</label>
										<div class="layui-input-inline" style="width:100px;padding-top:2px;">
											<input name="runSpace"  type="text" class="layui-input"><span id="space_unit" style="position: absolute;right: -20px;top: 15px;">天</span>
										</div>
									</div>
								</div>
							</div>
							<div id="run_time_tr" style="display: none;">
								<div class="layui-form-item">
									<div class="layui-inline">
										<label class="layui-form-label">于：</label>
										<div class="layui-input-inline" style="width:560px;">
											<div id="runWeekTime_div" style="width: 100%">
												<input name="runDates" value="2" lay-skin="primary" id="runDates2" type="checkbox"  title="周一"/>
												<input name="runDates" value="3" lay-skin="primary" id="runDates3" type="checkbox"  title="周二"/>
												<input name="runDates" value="4" lay-skin="primary" id="runDates4" type="checkbox"  title="周三"/>
												<input name="runDates" value="5" lay-skin="primary" id="runDates5" type="checkbox"  title="周四"/>
												<input name="runDates" value="6" lay-skin="primary" id="runDates6" type="checkbox"  title="周五"/>
												<input name="runDates" value="7" lay-skin="primary" id="runDates7" type="checkbox"  title="周六"/>
												<input name="runDates" value="1" lay-skin="primary" id="runDates1" type="checkbox"  title="周日"/>
											
											</div>
											<div id="runMonthTime_div"  style="width: 100%">
												<#list 1..12 as a>
												<input name="runDates" id="runDatesM${a}" value="${a}" lay-skin="primary" type="checkbox"  title="${a}月"/>
												</#list>
												<br/>
												<div style="width:100px;margin-top:10px;position: relative;">
													<select name="runBeginDate" style="width:100px;">
													<#list 1..31 as a>
													<option value="${a}" >${a}</option>
													</#list>
													</select>
													<div  style="position: absolute;left: 110px;top: 7px;">日</div> 
												</div>
											</div>
										</div>
									</div>
								</div>
							</div>
							<div class="layui-form-item">
								<div class="layui-inline">
									<label class="layui-form-label">开始时间：</label>
									<div class="layui-input-inline" style="width:60px;padding-top:2px;">
										<select name="runBeginHour">
											<#list 0..23 as a>
											<option value="${a}"><#if a < 10 >0</#if>${a}</option>
											</#list>
										</select>
									</div>
									<div class="layui-input-inline" style="width:20px;padding-top:15px;margin-right:2px">：</div>
									<div class="layui-input-inline" style="width:60px;padding-top:2px;">
										<select name="runBeginMinute">
											<#list 0..59 as a>
											<option value="${a}"><#if a < 10 >0</#if>${a}</option>
											</#list>
										</select>
									</div>
									<div class="layui-input-inline" style="width:20px;padding-top:15px;margin-right:2px">：</div>
									<div class="layui-input-inline" style="width:60px;padding-top:2px;">
										<select name="runBeginSecond">
											<#list 0..59 as a>
											<option value="${a}"><#if a < 10 >0</#if>${a}</option>
											</#list>
										</select>
									</div>
								</div>
							</div>
							<div class="layui-form-item">
								<div class="layui-inline">
									<label class="layui-form-label"></label>
									<div class="layui-input-inline" style="width:60px;padding-top:2px;">
										<input lay-filter="repeatMgr" id="isRepeat" name="isRepeat"  value="1" type="checkbox" title="在该日内重复"/>
									</div>
								</div>
							</div>
							<div  id="repeat_div" style="display: none;">
								<div class="layui-form-item">
									<div class="layui-inline">
										<label class="layui-form-label">重复间隔：</label>
										<div class="layui-input-inline" style="width:100px;">
											<input id="repeatSpace"  class="layui-input" name="repeatSpace"  type="text">
										</div>
										<div class="layui-input-inline" style="width:100px;">
											分钟
										</div>
									</div>
									<div class="layui-inline">
										<label class="layui-form-label">持续时间：</label>
										<div class="layui-input-inline" style="width:100px;">
											<input id="repeatJustTime"  class="layui-input" name="repeatJustTime"  type="text">
										</div>
										<div class="layui-input-inline" style="width:100px;">
											小时
										</div>
									</div>
								</div>	
							</div>
						</div>
					</div>
				</div>
		    </div>
		  </div>
		</div>
		<div class="layui-form-button">
			<div class="layui-button-block">
				<button class="layui-btn" id="submit" lay-submit lay-filter="formDemo">立即提交</button>
				<button type="reset" class="layui-btn layui-btn-primary">重置</button>
			</div>
		</div>
	</form>
</div>
<script type="text/javascript">

	//Demo
	layui.use('form', function() {
		var form = layui.form;
		form.render(); //更新全部
		form.on('radio(plantask)', function(data){
		  if(data.value=='1'){
			  $("#autoplan").show();
		  }else{
			  $("#autoplan").hide();
		  }
		});  
		form.on("radio(exchange)",function(data){
			runSpaceMgr();
		});
		form.on("checkbox(repeatMgr)",function(data){
			repeatMgr();
		});
		
	});
	layui.use('element', function(){
		var element = layui.element;
	});
	layui.use('laydate', function() {
		var laydate = layui.laydate;

		var date = {
			min : '1950-01-01 00:00:00',
			istoday : false
		};

		laydate.render({ 
			elem: '#getdate' ,
			format:"yyyy-MM-dd",
			max:0
		});

		laydate.render({ 
			elem: '#cbirthday',
			format:"yyyy-MM-dd" ,
			max:0
		});
	});
	
	layui.config({
		  base: '/js/'
		}).use(['transfer'],function () {
		    var transfer = layui.transfer,$ = layui.$;
		    //数据源
		    var data1 = [
		    	<#if userList?? && userList?size gt 0>
		    		<#list userList as user><#if user_index!=0>,</#if>{'userids':'${user.id}','username':'${user.username!''}','uname':'${user.uname!''}'}</#list>
		    	</#if>
		    	];
		    var data2 = [];
		    //表格列
		    var cols = [{type: 'checkbox', fixed: 'left'},{field: 'userids', hide:true},{field: 'username', title: '用户名'},{field: 'uname', title: '姓名'}]
		    //表格配置文件
		    var tabConfig = {'page':true,'height':470}

		    var tb1 = transfer.render({
		        elem: "#root", //指定元素
		        cols: cols, //表格列  支持layui数据表格所有配置
		        data: [data1,data2], //[左表数据,右表数据[非必填]]
		        tabConfig: tabConfig //表格配置项 支持layui数据表格所有配置
		    })

		    //transfer.get(参数1:初始化返回值,参数2:获取数据[all,left,right,l,r],参数:指定数据字段)
		    //获取数据
			$('#submit').on('click',function () {
		        var data = transfer.get(tb1,'r');
		        console.log(data);
		        if(data != null && data.length > 0){
		        	for(i=0;i<data.length;i++){
		        		$("#disform").append("<input type='hidden' name='userids' value='"+data[i].userids+"' >");
		        	}
		        }
		    });
		    
		})
   
</script>
<SCRIPT type="text/javascript">
	function pannelMgr(idflag){
		$(".nav_tapWrap li").attr("class","nav_tapIthems");
		$("#"+idflag+"_bnt").attr("class","nav_tapIthems cur");
		$("#mainDiv>div").css("display","none");
		$("#"+idflag+"_div").css("display","block");
	}
	function repeatMgr(){
		if($("#isRepeat").is(":checked")){
			$("#repeat_div").css("display","");
		}else{
			$("#repeat_div").css("display","none");
		}
	}
	
	function makeupMgr(){
		if($("#ismakeup").is(":checked")){
			$("#makeup_div").css("display","");
		}else{
			$("#makeup_div").css("display","none");
		}
	}
	
	function exchangeTab(){
		var runType = $("input[name='runCycle']:checked").val();
		if(runType=="day"){
			$("#run_space_tr").css("display","block");
			$("#run_datetype_tr").css("display","block");
			$("#run_time_tr").css("display","none");
			$("#space_unit").html("天");
		}else if(runType=="week"){
			$("#run_space_tr").css("display","block");
			$("#run_datetype_tr").css("display","block");
			$("#run_time_tr").css("display","block");
			$("#runWeekTime_div").css("display","block");
			$("#runMonthTime_div").css("display","none");
			$("#space_unit").html("周");
		}else{
			$("#run_space_tr").css("display","none");
			$("#run_datetype_tr").css("display","none");
			$("#run_time_tr").css("display","block");
			$("#runMonthTime_div").css("display","block");
			$("#runWeekTime_div").css("display","none");
			
		}
	}

	function runSpaceMgr(){
		$("input[name='runDates']").attr("checked",false);
		exchangeTab();
	}
</SCRIPT>
<SCRIPT type="text/javascript">
	$(function(){
		loadURL("/apps/contacts/callagentorgan/organ.html?organ=${organData.id!''}"+"&activityid=${activityid!''}"  , "#skillAgentList") ;
	});
	var setting = {
		data: {
			simpleData: {
				enable: true
			}
		},
		callback: {
			onClick: onClick
		}
	};
	
	function onClick(e, treeId, treeNode) {
		/* loadURL("/apps/contacts/callagentorgan/organ.html?organ="+treeNode.id+"&activityid=${activityid!''}"  , "#skillAgentList") ; */
		if(treeNode.id!=''){
			$(".organtr").hide();
			$(".parent"+treeNode.id).show();
		}
		if(treeNode.id=='0'){
			$(".parent0").show();
		}
	}

	var zNodes =[
	    { id:'0', pId:'00', name:"组织机构", open:true , topic : false}
	    <#if organList??>
	    <#list organList as organ>
	    ,{ id:'${organ.id!''}', pId:'${organ.parent!'0'}', name:"${organ.name!''}", open:true , topic : true ,  <#if organ.area?? && organ.area != "">icon:"/images/area.png" <#else>icon:"/images/dept.png"</#if> }
	    </#list>
	    </#if>
	];
	
	$(document).ready(function(){
		var ztree = $.fn.zTree.init($("#organTree"), setting, zNodes);
		<#if organData??>
		var node = ztree.getNodeByParam('id', '${organData.id!''}');//获取id为1的点  
		ztree.selectNode(node);//选择点  
		</#if>
	});
</SCRIPT>